<template>
  <div id="app">
    <keep-alive include="keep">
      <router-view></router-view>
    </keep-alive>
  </div>
</template>
<script>
export default {
  name: 'App',
  data() {
    return {
      keep: [],
    }
  },
  mounted() {
    if (process.env.VUE_APP_ENV === 'development') {
      //  document.querySelector("body").style.background = "rgb(1, 16, 40)";
    } else {
      document.querySelector('body').style.background = '#fff'
    }
  },
  created() {
    this.$router.options.routes.forEach((ele) => {
      if (ele?.meta?.keep) {
        this.keep.push(ele.name)
      }
    })
    console.log('需要被缓存的路由', this.keep)
  },
}
</script>

<style>
body {
  box-sizing: border-box;
  --window-padding: 10px;
  --window-vh: calc(100vh - 2 * var(--window-padding));
}

#app {
  /*height: 100vh;*/
  overflow: auto;
  padding: var(--window-padding);
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
form,
fieldset,
legend,
button,
input,
textarea,
th,
td {
  margin: 0;
  padding: 0;
}

body,
button,
input,
select,
textarea {
  font: 16px/1.5 tahoma, arial, \5b8b\4f53;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
}

address,
cite,
dfn,
em,
var {
  font-style: normal;
}

code,
kbd,
pre,
samp {
  font-family: couriernew, courier, monospace;
}

small {
  font-size: 12px;
}

ul,
ol {
  list-style: none;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

legend {
  color: #000;
}

fieldset,
img {
  border: 0;
}

button,
input,
select,
textarea {
  font-size: 100%;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  box-sizing: border-box;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: transparent;
  scrollbar-width: none;
  display: block;
}

::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow: inset 0 0 6px rgb(0 0 0 / 10%);
  -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 10%);
  background-color: #c8c8c8;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
  -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
  border-radius: 10px;
  background-color: #f5f5f5;
}


</style>
